<!DOCTYPE html>
<html>

<head th:include="_header_include::frag(~{::title},~{},~{})">
    <title>签约记录</title>
    <style>
        button a {
            color: #fff !important;
        }
    </style>
</head>
<body>
<div id="businessContractRecord" class="businessContractRecord mainPadding" style="display: none;">
    <el-breadcrumb separator="/" class="elBreadcrumb marginB20">
        <el-breadcrumb-item>Home</el-breadcrumb-item>
        <el-breadcrumb-item>商务管理</el-breadcrumb-item>
        <el-breadcrumb-item>签约审核</el-breadcrumb-item>
    </el-breadcrumb>
    <el-row class="marginB20">
        <el-tabs type="card" v-model="activeName" @tab-click="handleClick" >
            <el-tab-pane label="待审核签约" name="first"></el-tab-pane>
            <el-tab-pane label="已审核签约" name="second"></el-tab-pane>
        </el-tabs>
        <shiro:hasPermission name=" aggregation:signRecord:reject">
            <el-button type="danger" @click="OpenRejectSignRecordDialog" v-if="btnIsShow">驳回</el-button>
        </shiro:hasPermission>
        <shiro:hasPermission name=" aggregation:signRecord:pass">
            <el-button type="success" @click="pass" v-if="btnIsShow">审核通过</el-button>
        </shiro:hasPermission>
    </el-row>
    <div class="mainSearchBg">
        <div class="mainSearchFormBox">
            <el-form :inline="true" class="demo-form-inline mainSearchForm" :model="form" ref="form">
                <el-form-item label="签约项目:">
                    <el-select v-model="form.signProjectId" placeholder="签约项目" style="width: 100%;" clearable
                               filterable>
                        <el-option
                                v-for="item in projectList"
                                :key="item.id"
                                :label="item.projectName"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="商务组:">
                    <el-select v-model="form.businessGroupId" placeholder="商务组" style="width: 100%;" clearable
                               filterable :disabled="isSWZDisabled">
                        <el-option
                                v-for="item in businessGroupList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="商务经理:">
                    <el-select v-model="form.businessManagerId" placeholder="商务经理" style="width: 100%;" clearable
                               filterable>
                        <el-option
                                v-for="item in busManagerList"
                                :key="item.id"
                                :label="item.name"
                                :value="item.id">
                        </el-option>
                    </el-select>
                </el-form-item>
                <el-form-item label="签约时间:">
                    <el-date-picker
                            v-model="form.signStartTime"
                            type="datetime"
                            placeholder="选择日期时间">
                    </el-date-picker>
                </el-form-item>
                <el-form-item label="—" class="widthauto">
                    <el-date-picker
                            v-model="form.signEndTime"
                            type="datetime"
                            placeholder="选择日期时间">
                    </el-date-picker>
                </el-form-item>
                <el-row v-show="isShow">
                    <el-form-item label="电销组:">
                        <el-select v-model="form.teleGroupid" placeholder="电销组" style="width: 100%;" clearable
                                   @change="changeTeleGroup" filterable>
                            <el-option
                                    v-for="item in teleGroupList"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="电销顾问:">
                        <el-select v-model="form.teleSaleId" placeholder="电销顾问" style="width: 100%;" clearable filterable>
                            <el-option
                                    v-for="item in teleSaleList"
                                    :key="item.id"
                                    :label="item.name"
                                    :value="item.id">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="签约类型:">
                        <el-select v-model="form.signType" placeholder="签约类型" clearable>
                            <el-option
                                    v-for="item in signTypeOpt"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="签约单状态:" v-if="statusIsShow">
                        <el-select v-model="form.status" placeholder="签约单状态" clearable>
                            <el-option
                                    v-for="item in signOrderStatusOpt"
                                    :key="item.value"
                                    :label="item.label"
                                    :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="签约单编号:">
                        <el-input v-model="form.signNo" placeholder="签约单编号"></el-input>
                    </el-form-item>
                    <el-form-item label="客户姓名:">
                        <el-input v-model="form.customerName" placeholder="客户姓名"></el-input>
                    </el-form-item>
                    <el-form-item label="是否补齐尾款:">
                        <el-select v-model="form.isTailMoney" placeholder="是否补齐尾款" clearable>
                            <el-option v-for="item in isTailMoneyArr" :key="item.value" :label="item.label"
                                       :value="item.value">
                            </el-option>
                        </el-select>
                    </el-form-item>
                    <el-form-item label="资源Id:">
                        <el-input v-model="form.clueId" placeholder="资源Id"></el-input>
                    </el-form-item>
                    <el-form-item label="客户联系方式:">
                        <el-input v-model="form.cusPhone" placeholder="客户联系方式"></el-input>
                    </el-form-item>
                </el-row>
                <div class="mainSearchBtnBox">
                    <el-button icon="el-icon-search" type="primary" @click="initSignRecordData" class="searchBtn">搜索
                    </el-button>
                    <!-- <el-button type="info" class="searchBtn">取消</el-button> -->
                    <span style="color: #5c6be8;cursor: pointer;margin:0 10px;" @click="toogleClick"><span
                            v-if="isShow">收起</span><span v-else>展开更多</span><i
                            :class="{'greycolor paddingL6 el-icon-arrow-up':isShow,'greycolor paddingL6 el-icon-arrow-down':!isShow}"></i></span>
                </div>
            </el-form>
        </div>
        <el-row>
            <el-table
                    ref="dataTable"
                    tooltip-effect="dark"
                    style="width: 100%"
                    border
                    @selection-change="handleSelectionChange"
                    v-loading="loading"
                    :data="dataTable"
            >
                <el-table-column align="center" type="selection" width="55"></el-table-column>
                <el-table-column align="center" prop="serialNum" label="序号" width="55"></el-table-column>                
                <el-table-column align="center" prop="payStatus" label="付款明细状态" width="90">

                    <template slot-scope="scope">
                        <el-button v-if="scope.row.payStatus==0" size="mini" @click="reasonClick(scope.row)" type="text">
                            <span style="color: #555555">驳回&nbsp;</span><span style="color: blue">驳回原因</span>
                        </el-button>
                        <span v-else-if="scope.row.payStatus===1">
                            待审核 <span v-if="scope.row.payType ==1">
                                      (全款)
                                   </span>
                                   <span v-else-if="scope.row.payType ==2">
                                      (定金)
                                   </span>
                                   <span v-else-if="scope.row.payType ==3">
                                       (追加定金)
                                   </span>
                                   <span v-else-if="scope.row.payType ==4">
                                       (尾款)
                                   </span>
                        </span>
                        <span v-else-if="scope.row.payStatus===2 && scope.row.signStatus !=4 && scope.row.signStatus !=6">
                             有效  <span v-if="scope.row.payType ==1">
                                     (全款)
                                   </span>
                                   <span v-else-if="scope.row.payType ==2">
                                      (定金)
                                   </span>
                                   <span v-else-if="scope.row.payType ==3">
                                       (追加定金)
                                   </span>
                                   <span v-else-if="scope.row.payType ==4">
                                       (尾款)
                                   </span>
                        </span>
                        <el-button
                                v-else-if="scope.row.payStatus===2 && (scope.row.signStatus === 4 || scope.row.signStatus === 6)"
                                size="mini" @click="refundClick(scope.row)" type="text">
                            <span style="color: #555555">已退款&nbsp;</span><span style="color: red">退款信息</span>
                        </el-button>
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="signType" label="签约类型" :formatter="getSignTypeText" width="90"></el-table-column>
                <el-table-column align="center" prop="paymentDetails" label="付款明细" width="90px">
                    <template slot-scope="scope">
                        <el-button @click="recordClick(scope.row)" type="text" size="small">查看明细</el-button>
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="customerName" label="客户姓名" width="120"></el-table-column>
                <el-table-column align="center" prop="phone" label="联系方式" width="100"></el-table-column>
                <el-table-column align="center" prop="signProjectName" label="签约项目" width="120"></el-table-column>
                <el-table-column align="center" prop="signShopTypeName" label="签约店型" width="65"></el-table-column>
                <el-table-column align="center" prop="signProvince" label="签约省份" width="100"></el-table-column>
                <el-table-column align="center" prop="signCity" label="签约城市" width="100"></el-table-column>
                <el-table-column align="center" prop="signDictrict" label="签约区/县" width="100"></el-table-column>
                <el-table-column align="center" prop="amountReceivable" label="合同应收金额" width="65"></el-table-column>
                <el-table-column align="center" prop="teleSaleName" label="电销顾问" width="120"></el-table-column>
                <el-table-column align="center" prop="accountPhone" label="电销顾问电话" width="100"></el-table-column>
                <el-table-column align="center" prop="teleGroupName" label="电销组" width="100"></el-table-column>  
                <el-table-column align="center" prop="businessManagerName" label="商务经理" width="120"></el-table-column>
                <el-table-column align="center" prop="businessGroupName" label="商务组" width="100"></el-table-column> 
                <el-table-column align="center" prop="idCard" label="客户身份证号" width="100"></el-table-column>     
                <el-table-column align="center" prop="createTime" label="签约时间" width="130"></el-table-column>
                <el-table-column align="center" prop="signNo" label="签约单编号" width="160"></el-table-column>
                <el-table-column align="center" prop="isRemoteSign" label="是否远程签约" width="90">
                    <template slot-scope="scope">
                        <div v-if="scope.row.isRemoteSign == 0">
                            否
                        </div>
                        <div v-else-if="scope.row.isRemoteSign ==1">
                            是
                        </div>
                    </template>
                </el-table-column>    
                <!--<el-table-column align="center" prop="firstToll" label="路费"></el-table-column>-->
                <!--<el-table-column align="center" prop="preferentialAmount" label="优惠金额"></el-table-column>-->
            </el-table>
            <table-pagination :pager="pager" @change="initSignRecordData"></table-pagination>
        </el-row>
    </div>
    <!-- dialog -->
    <!-- 驳回处理 -->
    <el-dialog title="提示" :visible.sync="dialogFormVisible" width="540px">
        <el-form :model="dialogForm" ref="dialogForm" :rules="dialogRules">
            <div class="fs16 marginB20">确定要将此{{signRecordArrTitle}} 签约单驳回吗？</div>
            <el-form-item label="驳回原因：" label-width="100px" prop="reason">
                <el-input
                        type="textarea"
                        :rows="4"
                        placeholder="请输入驳回原因"
                        maxLength="100"
                        v-model="dialogForm.reason">
                </el-input>
            </el-form-item>
            <div class="f-tar">最多100字</div>
        </el-form>
        <div slot="footer" class="dialog-footer">
            <el-button type="primary" :disabled="btnDisabled" @click="submitDialogForm('dialogForm')">确 定</el-button>
            <el-button @click="dialogFormVisible = false">取 消</el-button>
        </div>
    </el-dialog>
    <!-- 驳回原因 -->
    <el-dialog title="驳回原因" :visible.sync="reasonDialog" width="540px">
        <div class="fs16 marginB20">{{rebutReason}}</div>
    </el-dialog>
    <!-- 退款信息 -->
    <el-dialog title="退款信息" :visible.sync="refundDialog" width="500px">
        <template>
            <el-row>
                <p class="marginB10">退款时间：{{refundTable.refundTime}}</p>
            </el-row>
            <el-row>
                <p class="marginB10">退款金额：{{refundTable.cusAmount}}元</p>
            </el-row>
            <el-row>
                <p class="marginB10" style="color: red">退款原因：{{refundTable.reason}}</p>
            </el-row>
        </template>
    </el-dialog>
    <!-- 付款明细 -->
    <el-dialog title="付款明细" :visible.sync="recordDialog" width="950px">
        <div v-show="visitRecordShow" class="fs16 marginB20">签约单编号({{curRow.signNo}})付款明细以及付款绑定到访记录</div>
        <div v-show="paymentDetailsShow">
            <div class="fs16 marginB20">全款付款明细</div>
            <el-table ref="recordTable" tooltip-effect="dark" style="width: 100%;margin-bottom: 20px;" border :data="recordTable">
                <el-table-column align="center" prop="statementNo" label="结算单编号"></el-table-column>
                <el-table-column align="center" prop="payName" label="付款人姓名"></el-table-column>
                <el-table-column align="center" prop="payMode" label="付款方式" :formatter="getPayModeText" width="80"></el-table-column>
                <el-table-column align="center" prop="payTime" label="付款时间" :formatter="getTimeText" width="140"></el-table-column>
                <el-table-column align="center" prop="amountReceived" label="实收金额" width="100"></el-table-column>
                <el-table-column align="center" prop="amountEquipment" label="实收设备金额" width="100"></el-table-column>
                <el-table-column align="center" prop="preferentialAmount" label="招商政策优惠金额" width="150"></el-table-column>
                <el-table-column align="center" prop="firstToll" label="路费" width="150"></el-table-column>
                <el-table-column align="center" prop="giveAmount" label="赠送金额" width="150"></el-table-column>
                <el-table-column align="center" prop="giveType" label="赠送类型" width="150" :formatter="transGiveType"></el-table-column>
                <el-table-column align="center" prop="amountPerformance" label="业绩金额" width="100"></el-table-column>
                <el-table-column align="center" prop="status" label="明细状态" :formatter="getStatusText" width="100"></el-table-column>
                <el-table-column align="center" prop="remarks" label="备注"></el-table-column>
            </el-table>
        </div>
        <div v-show="paymentDetailsShow2">
            <div class="fs16 marginB20">定金付款明细</div>
            <el-table
                    ref="recordTable2"
                    tooltip-effect="dark"
                    style="width: 100%;margin-bottom: 20px;"
                    border
                    :data="recordTable2"
            >
                <el-table-column align="center" prop="statementNo" label="结算单编号"></el-table-column>
                <el-table-column align="center" prop="payName" label="付款人姓名"></el-table-column>
                <el-table-column align="center" prop="payMode" label="付款方式" :formatter="getPayModeText"
                                 width="80"></el-table-column>
                <el-table-column align="center" prop="payTime" label="付款时间" :formatter="getTimeText"
                                 width="140"></el-table-column>
                <el-table-column align="center" prop="amountReceived" label="实收金额" width="100"></el-table-column>
                <el-table-column align="center" prop="amountEquipment" label="实收设备金额" width="100"></el-table-column>
                <el-table-column align="center" prop="preferentialAmount" label="招商政策优惠金额" width="150"></el-table-column>
                <el-table-column align="center" prop="firstToll" label="路费" width="150"></el-table-column>
                <el-table-column align="center" prop="giveAmount" label="赠送金额" width="150"></el-table-column>
                <el-table-column align="center" prop="giveType" label="赠送类型" width="150" :formatter="transGiveType"></el-table-column>
                <el-table-column align="center" prop="amountPerformance" label="业绩金额" width="100"></el-table-column>
                <el-table-column align="center" prop="amountBalance" label="余款金额" width="100"></el-table-column>
                <el-table-column align="center" prop="makeUpTime" label="预计余款补齐时间" :formatter="getTimeText"
                                 width="140"></el-table-column>
                <el-table-column align="center" prop="status" label="明细状态" :formatter="getStatusText"
                                 width="100"></el-table-column>
                <el-table-column align="center" prop="remarks" label="备注"></el-table-column>
            </el-table>
        </div>
        <div v-show="paymentDetailsShow3">
            <div class="fs16 marginB20">二次定金付款明细</div>
            <el-table
                    ref="recordTable3"
                    tooltip-effect="dark"
                    style="width: 100%;margin-bottom: 20px;"
                    border
                    :data="recordTable3"
            >
                <el-table-column align="center" prop="statementNo" label="结算单编号"></el-table-column>
                <el-table-column align="center" prop="payName" label="付款人姓名"></el-table-column>
                <el-table-column align="center" prop="payMode" label="付款方式" :formatter="getPayModeText"
                                 width="80"></el-table-column>
                <el-table-column align="center" prop="payTime" label="付款时间" :formatter="getTimeText"
                                 width="140"></el-table-column>
                <el-table-column align="center" prop="amountReceived" label="实收金额" width="100"></el-table-column>
                <el-table-column align="center" prop="amountEquipment" label="实收设备金额" width="100"></el-table-column>
                <el-table-column align="center" prop="preferentialAmount" label="招商政策优惠金额" width="150"></el-table-column>
                <el-table-column align="center" prop="firstToll" label="路费" width="150"></el-table-column>
                <el-table-column align="center" prop="giveAmount" label="赠送金额" width="150"></el-table-column>
                <el-table-column align="center" prop="giveType" label="赠送类型" width="150" :formatter="transGiveType"></el-table-column>
                <el-table-column align="center" prop="amountPerformance" label="业绩金额" width="100"></el-table-column>
                <el-table-column align="center" prop="amountBalance" label="余款金额" width="100"></el-table-column>
                <el-table-column align="center" prop="makeUpTime" label="预计余款补齐时间" :formatter="getTimeText"
                                 width="140"></el-table-column>
                <el-table-column align="center" prop="status" label="明细状态" :formatter="getStatusText"
                                 width="100"></el-table-column>
                <el-table-column align="center" prop="remarks" label="备注"></el-table-column>
            </el-table>
        </div>
        <div v-show="paymentDetailsShow4">
            <div class="fs16 marginB20">尾款付款明细</div>
            <el-table
                    ref="recordTable"
                    tooltip-effect="dark"
                    style="width: 100%;margin-bottom: 20px;"
                    border
                    :data="recordTable4"
            >
                <el-table-column align="center" prop="statementNo" label="结算单编号"></el-table-column>
                <el-table-column align="center" prop="payName" label="付款人姓名"></el-table-column>
                <el-table-column align="center" prop="payMode" label="付款方式"
                                 :formatter="getPayModeText"></el-table-column>
                <el-table-column align="center" prop="payTime" label="付款时间" :formatter="getTimeText"></el-table-column>
                <el-table-column align="center" prop="amountReceived" label="实收金额"></el-table-column>
                <el-table-column align="center" prop="amountEquipment" label="实收设备金额" width="100"></el-table-column>
                <el-table-column align="center" prop="preferentialAmount" label="招商政策优惠金额" width="150"></el-table-column>
                <el-table-column align="center" prop="firstToll" label="路费" width="150"></el-table-column>
                <el-table-column align="center" prop="giveAmount" label="赠送金额" width="150"></el-table-column>
                <el-table-column align="center" prop="giveType" label="赠送类型" width="150" :formatter="transGiveType"></el-table-column>
                <el-table-column align="center" prop="amountPerformance" label="业绩金额"></el-table-column>
                <el-table-column align="center" prop="status" label="明细状态" :formatter="getStatusText"></el-table-column>
                <el-table-column align="center" prop="remarks" label="备注"></el-table-column>
            </el-table>
        </div>
        <div v-show="visitRecordShow">
            <div class="fs16 marginB20">关联到访记录</div>
            <el-table ref="recordTable" tooltip-effect="dark" style="width: 100%;margin-bottom: 20px;" border
                      :data="visitRecordTable">
                <el-table-column align="center" prop="vistitTime" label="到访时间" width="140"></el-table-column>
                <el-table-column align="center" prop="vistitStoreTypeName" label="到访店铺类型" width="120"></el-table-column>
                <el-table-column align="center" prop="visitType" label="到访类型" width="90">
                    <template slot-scope="scope">
                        <div v-if="scope.row.visitType == 1">
                            预约来访
                        </div>
                        <div v-else-if="scope.row.visitType == 2">
                            慕名来访
                        </div>
                        <div v-else-if="scope.row.visitType == 3">
                            临时来访
                        </div>
                    </template>
                </el-table-column>
                <el-table-column align="center" prop="arrVisitCity" label="到访城市"></el-table-column>
                <el-table-column align="center" prop="createTime" label="创建时间" width="140"></el-table-column>
                <el-table-column align="center" prop="visitNum" label="到访次数" :formatter="transVisitNum"
                                 width="90"></el-table-column>
                <el-table-column align="center" prop="status" label="到访有效性" :formatter="getStatusText"
                                 width="100"></el-table-column>
            </el-table>
        </div>
        <div v-show="showbutton" slot="footer" class="dialog-footer f-tac">
            <template>
                <shiro:hasPermission name=" aggregation:signRecord:reject">
                    <el-button type="primary" @click="rebutOne">驳回</el-button>
                </shiro:hasPermission>
                <shiro:hasPermission name=" aggregation:signRecord:pass">
                    <el-button type="success" @click="passOne">审核通过</el-button>
                </shiro:hasPermission>
            </template>
        </div>
    </el-dialog>
</div>
<!-- import Vue before Element -->
<div th:include="_footer_include :: #jsLib"></div>
<script th:inline="javascript">
    /*  var projectList = [[${projectList}]];
     var busManagerList = [[${busManagerList}]];
     var teleGroupList = [[${teleGroupList}]]; */
    //var teleSaleList = [[${teleSaleList}]];

    //退款信息数据
    var refundData = [[${refundData}]];
    var payModeItem =[[${payModeItem}]];
    var giveTypeList =[[${giveTypeList}]];
    var businessGroupList = [[${businessGroupList}]];
    var ownOrgId=[[${ownOrgId}]];//商务总监商务组
</script>

</body>

<script>
    var signRecordVM = new Vue({
        el: '#businessContractRecord',
        data: function () {
            return {
                btnIsShow:true,
                statusIsShow:false,
                activeName: 'first',//tabs:签约记录
                btnDisabled: false,    
                isShow: false,
                showbutton: false,
                loading: true,
                dialogFormVisible: false,
                recordDialog: false,
                reasonDialog: false,
                refundDialog: false,
                paymentDetailsShow: false,//判断全款付款明细表格是否显示
                paymentDetailsShow2: false,//判断定金付款明细表格是否显示
                paymentDetailsShow3: false,//判断二次定金付款明细表格是否显示
                paymentDetailsShow4: false,//判断尾款付款明细表格是否显示
                visitRecordShow: false,
                isSWZDisabled:false,
                curRow: "", // 列表数据：当前行，使用地点：付款明细
                form: {
                    queryType:'',
                    signProjectId: '',
                    businessGroupId: ownOrgId,
                    businessManagerId: '',
                    teleGroupid: '',
                    teleSaleId: '',
                    signType: '',
                    status: '',
                    signStartTime: '',
                    signEndTime: '',
                    signNo: '',
                    customerName: '',
                    isTailMoney: ''
                },
                formLabelWidth: '150px',
                dataTable: [],
                projectList: [],
                busManagerList: [],
                businessGroupList: businessGroupList,
                teleGroupList: [],
                teleSaleList: [],
                refundTable: [],
                signTypeOpt: [{
                    value: 1,
                    label: '一次性全款'
                }, {
                    value: 2,
                    label: '先交定金'
                }],
                isTailMoneyArr: [{value: '', label: '全部'}, {value: '0', label: '否'}, {value: '1', label: '是'}],
                signOrderStatusOpt: [
                    {value: '', label: '全部'},
                    {value: 0, label: '无效'},
                    // {value: 1, label: '待审核'},
                    {value: 2, label: '有效'}
                ],
                value: '',//下拉选项默认值
                recordTable: [],
                recordTable2: [],
                recordTable3: [],
                recordTable4: [],
                visitRecordTable: [],
                dialogForm: {
                    reason: ''
                },
                dialogRules: {
                    reason: [
                        {required: true, message: '请输入驳回原因', trigger: 'blur'}
                    ]
                },
                pager: {//
                    total: 0,
                    currentPage: 1,
                    pageSize: 20,
                },
                rebutReason: '',//驳回原因
                multipleSelection: [],
                signRecordArrTitle: '',
            }
        },
        methods: {
            handleClick(tab, event) {  //到访或者未到访tab切换
                console.log(tab)
                if(tab.name=='first'){
                    this.form.queryType = '';
                    this.pager.currentPage = 1;
                    // this.dataTable=[];
                    this.statusIsShow=false;
                    this.btnIsShow=true;
                    this.initSignRecordData();
                }else{
                    this.statusIsShow=true;
                    this.btnIsShow=false;
                    this.form.queryType = "1";
                    this.pager.currentPage = 1;
                    // this.dataTable=[];
                    this.initSignRecordData();
                }
            },
            transGiveType(row, column, value, index) {
                var text="";
                for(var i=0;i<giveTypeList.length;i++) {
                    if(giveTypeList[i].value ==value){
                        text = giveTypeList[i].name;
                    }
                }
                return text;
            },

            transVisitNum(row, column, cellValue, index) {
                var text = "";
                if (cellValue == "1") {
                    text = "首次到访"
                } else if (cellValue == "2") {
                    text = "二次到访"
                } else {
                    text = this.toChinesNum(cellValue) + "次到访"
                }
                return text;
            },
            toChinesNum(num) {
                let changeNum = ['零', '一', '二', '三', '四', '五', '六', '七', '八', '九']; //changeNum[0] = "零"
                let unit = ["", "十", "百", "千", "万"];
                num = parseInt(num);
                let getWan = (temp) => {
                    let strArr = temp.toString().split("").reverse();
                    let newNum = "";
                    for (var i = 0; i < strArr.length; i++) {
                        newNum = (i == 0 && strArr[i] == 0 ? "" : (i > 0 && strArr[i] == 0 && strArr[i - 1] == 0 ? "" : changeNum[strArr[i]] + (strArr[i] == 0 ? unit[0] : unit[i]))) + newNum;
                    }
                    return newNum;
                }
                let overWan = Math.floor(num / 10000);
                let noWan = num % 10000;
                if (noWan.toString().length < 4) noWan = "0" + noWan;
                return overWan ? getWan(overWan) + "万" + getWan(noWan) : getWan(num);
            },
            submitDialogForm(formName) {
                this.$refs[formName].validate((valid) => {
                    if (valid) {
                        var param = {};
                        var rows = this.multipleSelection;
                        if (rows.length == 0) {
                            rows.push(this.curRow);
                        }
                        var payIdArr = new Array();
                        var signIdArr = new Array();
                        var isPass = true;
                        for (var i = 0; i < rows.length; i++) {
                            var curRow = rows[i];
                            if (curRow.payStatus != 1) {
                                this.$message({message: '只允许审核待审核的数据', type: 'warning'});
                                isPass = false;
                                break;
                            }
                            signIdArr.push(curRow.id);
                            payIdArr.push(curRow.payDetailId)
                        }
                        if (!isPass) {
                            return;
                        }
                        param.idList = payIdArr;
                        param.signIdList = signIdArr;
                        param.rebutReason = this.dialogForm.reason;
                        this.btnDisabled = true; 
                        axios.post('/sign/signRecord/rejectSignOrder', param)
                            .then(function (response) {
                                var resData = response.data;
                                if (resData.code == '0') {
                                    signRecordVM.dialogForm.reason = '';
                                    signRecordVM.dialogFormVisible = false;
                                    signRecordVM.$message({
                                        message: '操作成功', type: 'success', duration: 2000, onClose: function () {
                                            signRecordVM.btnDisabled = false; 
                                            signRecordVM.initSignRecordData();
                                            signRecordVM.recordDialog = false;
                                        }
                                    });
                                } else {
                                    signRecordVM.$message({message: resData.msg, type: 'error'});
                                    signRecordVM.btnDisabled = false; 
                                    console.error(resData);
                                }

                            })
                            .catch(function (error) {
                                console.log(error);
                                signRecordVM.btnDisabled = false; 
                            }).then(function () {
                        });


                    } else {
                        console.log('error submit!!');
                        return false;
                    }
                });
            },
            recordClick(row) {//查看明细
                this.paymentDetailsShow = false;
                this.paymentDetailsShow2 = false;
                this.paymentDetailsShow3 = false;
                this.paymentDetailsShow4 = false;
                this.visitRecordShow = false;
                this.curRow = row;
                if (row.payStatus == 1) {
                    this.showbutton = true;
                } else {
                    this.showbutton = false;
                }
                // row.signNo;
                var param = {};
                param.id = row.payDetailId;
                param.signId = row.id;
                axios.post('/sign/signRecord/findPayDetailById', param)
                    .then(function (response) {
                        var resData = response.data;
                        console.log(resData.data)
                        if (resData.code == '0') {
                            var payDetailData = resData.data;
                            if (payDetailData[1]) {
                                signRecordVM.paymentDetailsShow = true;
                                signRecordVM.recordTable = payDetailData[1];
                            }
                            if (payDetailData[2]) {
                                signRecordVM.paymentDetailsShow2 = true;
                                console.info(payDetailData[2]);
                                signRecordVM.recordTable2 = payDetailData[2];
                            }
                            if (payDetailData[3]) {
                                signRecordVM.paymentDetailsShow3 = true;
                                signRecordVM.recordTable3 = payDetailData[3];
                            }
                            if (payDetailData[4]) {
                                signRecordVM.paymentDetailsShow4 = true;
                                signRecordVM.recordTable4 = payDetailData[4];
                            }
                            if (payDetailData['visitRecord']) {
                                if (payDetailData['visitRecord'].length > 0) {
                                    signRecordVM.visitRecordShow = true;
                                    signRecordVM.visitRecordTable = payDetailData['visitRecord'];
                                }
                            }
                        } else {
                            signRecordVM.$message({message: resData.msg, type: 'error'});
                            console.error(resData);
                        }
                        signRecordVM.recordDialog = true;

                    })
                    .catch(function (error) {
                        console.log(error);
                    }).then(function () {
                });

            },
            reasonClick(row) {//驳回原因
                this.rebutReason = row.rebutReason;
                this.reasonDialog = true;
            },

            refundClick(row) {//退款信息
                var param = {};
                param.signId = row.id;
                param.signStatus = row.signStatus;
                axios.post('/sign/signRecord/getRefundInfo', param)
                    .then(function (response) {
                        var result = response.data;
                        signRecordVM.refundTable = result;
                        signRecordVM.refundTable.refundTime = result.data.refundTime;
                        signRecordVM.refundTable.cusAmount = result.data.cusAmount;
                        signRecordVM.refundTable.reason = result.data.reason;
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
                this.refundDialog = true;
            },

            pass() {//审核通过
                var rows = this.multipleSelection;
                if (rows.length < 1) {
                    this.$message({
                        message: '请选择数据',
                        type: 'warning'
                    });
                    return;
                }
                var title = "";
                var payIdArr = new Array();
                var signIdArr = new Array();
                var isPass = true;
                for (var i = 0; i < rows.length; i++) {
                    var curRow = rows[i];
                    if (curRow.payStatus != 1) {
                        this.$message({message: '只允许审核待审核的数据', type: 'warning'});
                        isPass = false;
                        break;
                    }
                    title += "【" + curRow.serialNum + "" + curRow.customerName + "】 ";
                    signIdArr.push(curRow.id);
                    payIdArr.push(curRow.payDetailId)
                }
                if (!isPass) {
                    return;
                }

                this.$confirm('确定要将此 ' + title + ' 签约单审核通过吗？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var param = {};
                    param.idList = payIdArr;
                    param.signIdList = signIdArr;
                    axios.post('/sign/signRecord/passAuditSignOrder', param)
                        .then(function (response) {
                            var resData = response.data;
                            if (resData.code == '0') {
                                signRecordVM.dialogFormVisible = false;
                                signRecordVM.$message({
                                    message: '操作成功', type: 'success', duration: 2000, onClose: function () {
                                        signRecordVM.initSignRecordData();
                                    }
                                });
                            } else {
                                signRecordVM.$message({message: resData.msg, type: 'error'});
                                console.error(resData);
                            }

                        })
                        .catch(function (error) {
                            console.log(error);
                        }).then(function () {
                    });

                }).catch(() => {
                    this.$message({
                        type: 'info',
                        message: '已取消审核'
                    });
                });
            },

            passOne() { //审核通过一条
                var curRow = this.curRow;
                var title = "";
                var payIdArr = new Array();
                var signIdArr = new Array();
                var isPass = true;
                if (curRow.payStatus != 1) {
                    this.$message({message: '只允许审核待审核的数据', type: 'warning'});
                    isPass = false;
                } else {
                    payIdArr.push(curRow.payDetailId);
                    signIdArr.push(curRow.id);
                }
                this.$confirm('确定要将此 ' + title + ' 签约单审核通过吗？', '提示', {
                    confirmButtonText: '确定',
                    cancelButtonText: '取消',
                    type: 'warning'
                }).then(() => {
                    var param = {};
                    param.idList = payIdArr;
                    param.signIdList = signIdArr;
                    axios.post('/sign/signRecord/passAuditSignOrder', param)
                        .then(function (response) {
                            var resData = response.data;
                            if (resData.code == '0') {
                                signRecordVM.dialogFormVisible = false;
                                signRecordVM.$message({
                                    message: '操作成功', type: 'success', duration: 2000, onClose: function () {
                                        signRecordVM.initSignRecordData();// 刷新列表
                                        signRecordVM.recordDialog = false;
                                    }
                                });
                            } else {
                                signRecordVM.$message({message: resData.msg, type: 'error'});
                                console.error(resData);
                            }
                        }).catch(function (error) {
                        console.log(error);
                    }).then(function () {
                    });
                }).catch(() => {
                    this.$message({type: 'info', message: '已取消审核'});
                });
            },

            initSignRecordData() {

                var startTime = this.form.signStartTime;
                var endTime = this.form.signEndTime;
                var startTimestamp = Date.parse(new Date(startTime));
                if (endTime) {
                    var endTimestamp = new Date(endTime);
                    if (startTimestamp > endTimestamp) {
                        this.$message({
                            message: '开始时间不能大于结束时间',
                            type: 'warning'
                        });
                        return;
                    }
                }

                var param = this.form;
                param.pageNum = this.pager.currentPage;
                param.pageSize = this.pager.pageSize;
                axios.post('/sign/signRecord/listSignRecord', param)
                    .then(function (response) {
                        var data = response.data;
                        if (data.code == '0') {
                            var resData = data.data;
                            signRecordVM.dataTable = resData.data;
                            //3.分页组件
                            signRecordVM.pager.total = resData.total;
                            signRecordVM.pager.currentPage = resData.currentPage;
                            signRecordVM.pager.pageSize = resData.pageSize;

                        } else {
                            signRecordVM.$message({message: data.msg, type: 'error'});
                            console.error(data);
                        }

                    })
                    .catch(function (error) {
                        console.log(error);
                    }).then(function () {
                    signRecordVM.loading = false;
                });

            },
            OpenRejectSignRecordDialog() {
                this.signRecordArrTitle = '';
                this.dialogForm.reason = '';
                var rows = this.multipleSelection;
                if (rows.length < 1) {
                    this.$message({
                        message: '请选择数据',
                        type: 'warning'
                    });
                    return;
                }
                var title = "";
                var isPass = true;
                for (var i = 0; i < rows.length; i++) {
                    var curRow = rows[i];
                    if (curRow.payStatus != 1) {
                        this.$message({message: '只允许审核待审核的数据', type: 'warning'});
                        isPass = false;
                        break;
                    }
                    title += "【" + curRow.serialNum + "" + this.getCustomerName(curRow.customerName) + "】 ";
                }
                if (!isPass) {
                    return;
                }
                this.signRecordArrTitle = title;
                this.dialogFormVisible = true;
            },

            rebutOne() {
                this.signRecordArrTitle = '';
                this.dialogForm.reason = '';
                var title = "";
                var isPass = true;
                var curRow = this.curRow;
                this.multipleSelection = [];
                if (curRow.payStatus != 1) {
                    this.$message({message: '只允许审核待审核的数据', type: 'warning'});
                    isPass = false;
                }
                title += "【" + curRow.serialNum + "" + this.getCustomerName(curRow.customerName) + "】 ";
                if (!isPass) {
                    return;
                }
                this.signRecordArrTitle = title;
                this.dialogFormVisible = true;
            },
            handleSelectionChange(val) {
                this.multipleSelection = val;
            },
            getSignTypeText(row, column, value, index) {
                var valText = "";
                if (value == 1) {
                    valText = "一次性全款";
                } else if (value == 2) {
                    valText = "先交定金";
                }
                return valText;
            },
            getSignShopTypeText(row, column, value, index) {
                var valText = "";
                if (value == 1) {
                    valText = "旗舰店";
                } else if (value == 2) {
                    valText = "创业店";
                } else if (value == 3) {
                    valText = "标准店";
                } else if (value == 5) {
                    valText = "区域代理";
                } else if (value == 6) {
                    valText = "单技术";
                }
                return valText;
            },
            getPayModeText(row, column, value, index) {
                var valText="";
                if(!value){
                    return valText;
                }
                var vals = value.split(",");
                if(payModeItem){
                    for(var j = 0 ; j < vals.length;j++  ){
                        for(var i = 0; i < payModeItem.length ; i++){
                            if(payModeItem[i].value == vals[j]){
                                if(j==0){
                                    valText += payModeItem[i].name;
                                }else{
                                    valText += ","+payModeItem[i].name;
                                }

                            }
                        }
                    }
                }
                return valText;
            },
            getStatusText(row, column, value, index) {
                var valText = "";
                if (value == 0) {
                    valText = "驳回";
                }
                else if (value == 1) {
                    valText = "审核中";
                } else if (value == 2) {
                    valText = "有效";
                }
                return valText;
            },
            getTimeText(row, column, value, index) {
                var valText = "";
                if (value) {
                    // valText =  moment(value).format("YYYY-MM-DD HH:mm:ss");
                    valText = moment(value).format("YYYY-MM-DD");
                }
                return valText;
            },
            getCustomerName(val) {
                if (!val) {
                    return "";
                }
                return val;
            },
            changeTeleGroup(selectedValue) {//改变电销组
                this.teleSaleList = [];
                if (!selectedValue) {
                    return;
                }
                var param = {};
                param.orgId = selectedValue;
                axios.post('/business/busAllocation/getSaleList', param)
                    .then(function (response) {
                        var result = response.data;
                        var table = result.data;
                        signRecordVM.teleSaleList = table;
                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            getProjectList() {//获取projectLits
                axios.post('/sign/signRecord/queryProjectList', {})
                    .then(function (response) {
                        var result = response.data;
                        if (result.code == '0') {
                            var table = result.data;
                            signRecordVM.projectList = table;
                        } else {
                            console.error(response);
                        }

                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            queryBusManagerByOrgId() {//获取所有商务经理
                axios.post('/sign/signRecord/queryBusManagerByOrgId', {})
                    .then(function (response) {
                        var result = response.data;
                        if (result.code == '0') {
                            var table = result.data;
                            signRecordVM.busManagerList = table;
                        } else {
                            console.error(response);
                        }

                    })
                    .catch(function (error) {
                        console.log(error);
                    });
            },
            queryBusGroupList() {//根据组织机构Id查询所有商务经理
                axios.post('/organization/organization/queryBusGroupList', {})
                    .then(function (response) {
                        var result = response.data;
                        if (result.code == '0') {
                            var table = result.data;
                            signRecordVM.businessGroupList = table;
                        } else {
                            console.error(response);
                        }

                    })
                    .catch(function (error) {
                        console.log(error);
                    });

            },
            queryTeleGroupList() {//根据组织机构Id查询所有电销组
                axios.post('/organization/organization/queryTeleGroupList', {})
                    .then(function (response) {
                        var result = response.data;
                        if (result.code == '0') {
                            var table = result.data;
                            signRecordVM.teleGroupList = table;
                        } else {
                            console.error(response);
                        }

                    })
                    .catch(function (error) {
                        console.log(error);
                    });

            },
            initSelect() {//初始下拉框
                this.getProjectList();
                this.queryBusManagerByOrgId();
                this.queryBusGroupList();
                this.queryTeleGroupList();
            },
            toogleClick() {
                if (this.isShow) {
                    this.isShow = false
                } else {
                    this.isShow = true
                }
            },


        },
        mounted() {
            document.getElementById('businessContractRecord').style.display = 'block';
        },
        created() {
            // 取页数存储
            var localVal=localStorage.getItem('allChangePageSize')?parseInt(localStorage.getItem('allChangePageSize')):'';
            if(localVal){this.pager.pageSize = localVal;}
            if(ownOrgId){this.isSWZDisabled= true;}//商务总监商务组筛选按钮不可点击
            this.initSignRecordData();
            this.initSelect();
        }
    })
</script>
</html>